($=>{
    "use strict";

    let id = location.search.split("=")[1];

    let data = null;

    $.ajax({
        url:"http://localhost:81/data/pro.json",
        success:(res)=>{
            // console.log(res)
            res = JSON.parse(res)
            data = res;
            let i = 0;
            res.some((val,idx)=>{
                i = idx;
                return val.proId === id;
            })

            let imgList = ``;
            for(let j=0;j<res[i].imgList.length;j++){
                imgList += `<li>
                                <img src="${res[i].imgList[j]}" alt="">
                            </li>`
            }

            let detailImg = `<div id="thing-1">
                                <img src="${res[i].proImg}" alt="">
                            </div>
                            <div id="thing-one">
                                <ul>${imgList}</ul>
                            </div>`;
            $("#thing").html(detailImg);
        }
    })


    $("#cart").on("click",function(){
        let proMsg = localStorage.getItem("proMsg") ? JSON.parse(localStorage.getItem("proMsg")) : [];

        let index=0;
        data.some((val,idx)=>{
            index = idx;
            return val.proId === id;
        });

        if(proMsg.length >= 1){
            let flag = false;
            let i;
            for(i=0;i<proMsg.length;i++){
                if(proMsg[i].id === id){
                    flag = true;
                    break;
                }
            }
            if(flag){
                proMsg[i].num += parseInt($("#num").val())
            }else{
                proMsg.push({
                    id,
                    num:1,
                    price:this.res[index].price
                })
            }
        }else{
            proMsg.push({
                id,
                num:1,
                price:this.res[index].price
            })
        }

        localStorage.setItem("proMsg",JSON.stringify(proMsg));
    })


})(jQuery)